<extend name="Base/common"/>
<block name="style">
    <style type="text/css">


    *{
        padding: 0;
        margin: 0;
    }
    .content{
        width: 400px;
        height: 130px;
        margin: 0 auto;
        background: #f8f8f8;

    }
    .title{
        font-family: '微软雅黑';
        font-size: 16px;
        margin-left: 15%;
    }
    .box{
        width: 250px;
        height: 40px;
        border:1px solid #ccc;
        margin-top: 10px;
        line-height: 30px;
    }
    .content .box{
        display: inline-block;
        margin-left: 15%;
    }


    .getPasswordBtn{
    width: 100px;
    height: 30px;
    font-size: 15px;

    font-family: '微软雅黑';
    color: #000;
    border: none;
    background: #eee;
    margin-left:35%;

}

 .span_line{
    border-right:1px dashed #ccc;
    margin-left: 40px;
    margin-top: 15px;
 }

    </style>
</block>
<block name="body">

   
<style>
    .weui-btn::after{border-radius: 0;}
</style>
    <br><br>
    <if condition="I('get.show') neq 1 ">
         <div class="" style="position: fixed;bottom:0;width: 100%;">
            <div data-id="{$info.id}" data-type="1" class="weui-btn weui-btn_default hetong" style="width: 50%;float: left;border-radius: 0;">不同意</div>
            <div data-id="{$info.id}" data-type="2" class="weui-btn weui-btn_primary hetong"  style="width: 50%;float: right;margin-top:0;border-radius: 0;">我同意</div>
        </div>

    <div class="content" style="position: fixed;bottom:40%;width: 100%;">
        <div class="title">请输入验证码：</div>
        <div class="box" style="position: relative;">
            <span class="span_line"></span>
            <span class="span_line"></span>
            <span class="span_line"></span>
            <span class="span_line"></span>
            <span class="span_line"></span>

            <input type="number" id="input" style="border:none;position: absolute;width:230px;height:40px;background:none;letter-spacing:31px;margin-left:-76%;overflow:hidden" maxlength="6">
        </div>
        <!-- border:none; -->
        
        <div style="margin:auto;margin-top:15px;">
            <button class="getPasswordBtn">确认提交</button>
        </div>
        

    </div>


    </if>

</block>
<block name="script">
    <script >
                var code=0;

                $('#input').bind('input propertychange', function() {  
                    if($(this).val().length>5){
                        $(this).blur();
                    }  
                });
                      
                $('.hetong').click(function(){
                    $(this).parent().hide();
                    $('.content').show();

                    // 发送短信验证码
                    var ht='201710227020396107';
                   

                    $.ajax({
                        type:'post',
                        data:{'ht':ht},
                        url:"{:U('test')}",
                        success:function(m){
                            code=m;
                            popup.alert('短信验证码'+code)
                        }
                    })


                    // var box=document.getElementsByClassName("box")[0];
            
                    // createDIV(6,box);
                    // var pawDiv=document.getElementsByClassName("pawDiv");
                    // var paw=document.getElementsByClassName("paw");
                    // var pawDivCount=pawDiv.length;
                    // paw[0].readOnly=false;
                    // paw[0].focus();
                    // func(pawDiv,paw,pawDivCount);

                })

                $('.getPasswordBtn').click(function(){
                    // popup.alert(0)
                    var n=$('#input').val();
                    
                    n=parseInt(n);
                    code=parseInt(code);
                    if(code==n){
                        popup.alert(0)
                        // var Url  = "{:U('agreement')}";
                        // var type = $(this).attr('data-type');
                        // var id = $(this).attr('data-id');

                        // AjaxPost(Url,{type:type,id:id},function(data){
                        //     if(data.status==true){
                        //         confirm(data.info);
                        //     }else{
                        //         popup.alert(data.info);
                        //     }
                        //     setTimeout(function(){location.href="http://weixin.jcsmkj.cn/index.php?m=&c=Capital&a=myloan"},1500);
                        // })
                    }else{
                        popup.alert('验证码错误！')
                    }
                         
                })

        /*动态生成*/
     

            function createDIV(num,box){
                for(var i=0;i<num;i++){
                    var pawDiv=document.createElement("div");
                    pawDiv.className="pawDiv";
                    box.appendChild(pawDiv);
                    var paw=document.createElement("input");
                    paw.type="number";
                    paw.className="paw";
                    paw.maxLength="1";
                    paw.readOnly="readonly";
                    pawDiv.appendChild(paw);
                }
            }
        /*绑定pawDiv点击事件*/

        function func(pawDiv,paw,pawDivCount){
            for(var i=0;i<pawDivCount;i++){
                pawDiv[i].addEventListener("click",function(){
                    // pawDivClick(this);
                });
                paw[i].onkeyup=function(event){
                    console.log(event.keyCode);
                    if(event.keyCode>=48&&event.keyCode<=57){
                        /*输入0-9*/
                        changeDiv(pawDiv,paw,pawDivCount);

                    }else if(event.keyCode=="8") {
                        /*退格回删事件*/
                        firstDiv(pawDiv,paw,pawDivCount);

                    }

                };
            }

        }
        /*定义自动选中下一个输入框事件*/
        var changeDiv=function(pawDiv,paw,pawDivCount){
            for(var i=0;i<pawDivCount;i++){
                if(paw[i].value.length=="1"){
                    /*处理当前输入框*/
                    paw[i].blur();

                    /*处理上一个输入框*/
                    // paw[i+1].focus();
                    // paw[i+1].readOnly=false;

                    document.addEventListener(paw[i],function(e){
                        paw[i+1].focus();
                        paw[i+1].readOnly=false;
                    });
                }
            }
        };

        /*回删时选中上一个输入框事件*/
        var firstDiv=function(pawDiv,paw,pawDivCount){
            for(var i=0;i<pawDivCount;i++){
                console.log(i);
                if(paw[i].value.length=="0"){
                    /*处理当前输入框*/
                    console.log(i);
                    paw[i].blur();

                    /*处理上一个输入框*/
                    paw[i-1].focus();
                    paw[i-1].readOnly=false;
                    paw[i-1].value="";
                    // pawDivClick(pawDiv[i-1]);


                    document.addEventListener('touchstart',function(e){
                        paw[i-1].focus();
                        paw[i-1].readOnly=false;
                        paw[i-1].value="";
                    });


                    break;
                }
            }
        };





    </script>

</block>